<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
	*{padding:0; margin:0;}
	div{width:692px; height:176px; background:url(../images/header.jpg) no-repeat; margin:100px auto; position:relative;}
	ul{list-style:none; height:27px; line-height:27px; position:absolute; bottom:0;}
	li{height:27px; float:left;}
	li a{text-decoration:none; display:block; height:27px; background:url(../images/Navigation.gif) no-repeat;}
	.home{width:66px; margin-left:23px;}
	.about{width:69px;}
	.archive{width:76px;}
	.contact{width:85px;}
	.links{width:58px;}
	
	.home a{width:66px;}
	.about a{width:69px; background-position:-66px 0;}
	.archive a{width:76px; background-position:-136px 0;}
	.contact a{width:85px; background-position:-214px 0;}
	.links a{width:58px; background-position:-299px 0;}
	
	.home a:hover{width:66px ;background-position:0 -27px}
	.about a:hover{width:69px; background-position:-66px -27px;}
	.archive a:hover{width:76px; background-position:-136px -27px;}
	.contact a:hover{width:85px; background-position:-214px -27px;}
	.links a:hover{width:58px; background-position:-299px -27px;}
	
	.home .cur {width:66px ;background-position:0 -54px}
	.about .cur{width:69px; background-position:-66px -54px;}
	.archive .cur{width:76px; background-position:-136px -54px;}
	.contact .cur{width:85px; background-position:-214px -54px;}
	.links .cur{width:58px; background-position:-299px -54px;}
		body{background:#ff0}

</style>
</head>

<body>
	<div>
        <ul>
            <li class="home"><a  href="../index.html"></a></li>
            <li class="about"><a href="about.html"></a></li>
            <li class="archive"><a href="archive.html"></a></li>
            <li class="contact"><a href="contact.html"></a></li>
            <li class="links"><a class="cur"  href="links.html"></a></li>
        </ul>
    </div>
</body>
</html>
